'use strict';

import React, {PropTypes} from 'react';
import {
    View,
    Image,
    Text,
    StyleSheet
} from 'react-native';
import Global from '../Commom/GlobalConst';

const styles = StyleSheet.create({
    content: {
        flexDirection: 'row',
        alignItems: 'center'
    },
    star: {
        width: 12,
        height: 12,
        marginRight: 5
    },
    text: {
        fontSize: 12,
        textAlignVertical: 'center',
        marginRight: 5,
        color: Global.FontColor.LightGrey
    }
});

class RecommendedStar extends React.Component {
    render() {
        let {num} = this.props;
        let stars = [];
        for (var i = 0; i < 5; i++) {
            let img = i < num ? require('../../Image/star.png') : require('../../Image/un_star.png');
            stars.push(
                <Image key={"star" + i} source={img} style={styles.star}/>
            )
        }
        return (
            <View style={styles.content}>
                <Text style={styles.text}>推荐指数</Text>
                {stars}
            </View>
        )
    }
}

RecommendedStar.PropTypes = {
    num: PropTypes.number.isRequired
};

export default RecommendedStar;